<template>
	<div class="flow-completed-container">
		<el-dialog title="工作流完成情况" width="50%" :visible.sync="showBpmn" :before-close="close">
			<BpmnWorkflow :bpmn="bpmn" :isShowPalette="isShowPalette" :uploadConfig="uploadConfig" :showDetail="true" ref="bpmnWorkflow" />
		</el-dialog>
	</div>
</template>

<script>
import { mapActions } from 'vuex';
import BpmnWorkflow from '../bpmn/components/BpmnWorkflow.vue';
export default {
	components: {
		BpmnWorkflow
	},
	props: {
		showBpmn: {
			type: Boolean,
			default: () => false
		},
		workFlow: {
			type: Object,
			default: () => {},
			required: true
		},
		allfinshedNodes: {
			type: Array,
			default: () => [],
			required: true
		}
	},
	data() {
		return {
			bpmn: '',
			isShowPalette: false,
			uploadConfig: {
				// getter
				get: function () {
					const url = `${this.loginUrl}/ivcs/api/v1/upload`;
					const token = this.userInfo.adminToken;
					return {
						url: url,
						headers: { 'x-access-token': token }
					};
				},
				// setter
				set: function () {}
			}
		};
	},
	methods: {
		...mapActions('workflow', ['setStartNode', 'setWorkSteps', 'updateBreakRuleStatus', 'setBreakRuleNodes', 'setViewFlow']),
		close() {
			this.$emit('close');
		},

		// 获取所有完成节点
		getCompleted(talks) {
			this.allfinshedNodes.forEach(item => {
				if (talks[item]) {
					talks[item].isFinished = true;
				}
			});
			return talks;
		}
	},
	mounted() {
		this.setViewFlow(true);

		console.log(this.workFlow);
		if (this.workFlow && this.workFlow.talks) {
			const talks = JSON.parse(JSON.stringify(this.workFlow.talks));
			delete talks.startNode;
			console.log('talks:', talks);
			// 计算完成节点
			let nodes = this.getCompleted(talks, this.finishedNodes);
			this.setWorkSteps(nodes);
			// set start node to store
			this.setStartNode(this.workFlow.talks.startNode);
			this.bpmn = this.workFlow.bpmnXml;
			this.$nextTick(() => {
				this.$refs.bpmnWorkflow.init();
				this.$refs.bpmnWorkflow.showPalette();
			});
		}
	}
};
</script>

<style lang="less" scoped>
.flow-completed-container {
}
</style>
